<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>保时捷3</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/style3.css">
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="css/swiper.min.css">
</head>
<body class="index">
<div class="logo">
    <img src="https://files1.porsche.com/filestore/image/multimedia/none/875d5e3d-6763-47fe-bc52-809142d53274/svg/d4c766d7-7761-11e7-99c7-0019999cd470/porsche-svg.svg" alt="">
</div>
<div class="herder">
    <div class="container">
        <ul>
            <li><a href="">搜索</a></li>
            <li><a href="">可供选择的车辆</a></li>
        </ul>
    </div>
</div>
<div class="moit">
    <div class="container">
        <li><a href="index2.html">&lt;返回</a></li>
        <h1>已为您找到99+辆车</h1>
    </div>
</div>
<div class="inte">
    <div class="container">
        <div class="box-1">
            <div class="col-md-6">
                <!-- Swiper -->
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide"><img src="images/img-7-1.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-7-2.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-7-3.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-7-4.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-7-5.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-7-6.jpg.jpg" alt=""></div>
                    </div>
                    <!-- Add Arrows -->
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>

                <!-- Swiper JS -->
            </div>
            <div class="col-md-6">
                <div class="mmmm">
                    <h2>911 &bnot; Turbo &bnot;S</h2>
                    <p>深圳南山保时捷中心</p>
                    <p><span>427kW/580PS</span> | <span>64km</span> | <span>07.2017</span> | <span>2019</span></p>
                    <p>保时捷双离合器变速箱</p>
                    <span style="display: inline">3,260,000</span>
                    <img class="img-1" src="images/img10.jpg.png" alt="">
                    <a href="">>车辆信息</a>
                </div>

            </div>
        </div>
    </div>
</div>




<div class="inte">
    <div class="container">
        <div class="box-1">
            <div class="col-md-6">
                <!-- Swiper -->
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide"><img src="images/img-8-1.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-8-2.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-8-3.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-8-5.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-8-6.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-8-2.jpg.jpg" alt=""></div>
                    </div>
                    <!-- Add Arrows -->
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>

                <!-- Swiper JS -->
            </div>
            <div class="col-md-6">
                <div class="mmmm">
                    <h2>Pananera &bnot; Turbo &bnot;</h2>
                    <p>昆明滇池保时捷中心</p>
                    <p><span>404kW/550PS</span> | <span>3,996km</span> | <span>08.2019</span> | <span>2019</span></p>
                    <p>保时捷双离合器变速箱(自动)，汽油</p>
                    <span style="display: inline">2,700，000</span>
                    <img class="img-1" src="images/img10.jpg.png" alt="">
                    <a href="">>车辆信息</a>
                </div>

            </div>
        </div>
    </div>
</div>






<div class="inte">
    <div class="container">
        <div class="box-1">
            <div class="col-md-6">
                <!-- Swiper -->
                <div class="swiper-container">
                    <div class="swiper-wrapper">
                        <div class="swiper-slide"><img src="images/img-9-1.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-9-2.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-9-3.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-9-4.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-9-5.jpg.jpg" alt=""></div>
                        <div class="swiper-slide"><img src="images/img-9-6.jpg.jpg" alt=""></div>
                    </div>
                    <!-- Add Arrows -->
                    <div class="swiper-button-next"></div>
                    <div class="swiper-button-prev"></div>
                </div>

                <!-- Swiper JS -->
            </div>
            <div class="col-md-6">
                <div class="mmmm">
                    <h2>911 &bnot; GT3 &bnot;</h2>
                    <p>南宁保时捷中心</p>
                    <p><span>368kW/580PS</span> | <span>200km</span> | <span>03.2019</span> | <span>2019</span></p>
                    <p>保时捷双离合器变速箱（自动），汽油</p>
                    <span style="display: inline">2,318,000</span>
                    <img class="img-1" src="images/img10.jpg.png" alt="">
                    <a href="">>车辆信息</a>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="invent">
    <div class="container">
        <div class="box-2" id="app">
            <div class="col-md-3" v-for="list in message">
                <img :src="list.src" alt="">
                <p>{{list.title}}</p>
            </div>
        </div>
    </div>
</div>

<div class="footer">
    <div class="container">
        <div class="foot">
            <p class="qwer">©2019&bnot;保时捷&bnot;（中国）&bnot; 汽车销售有限公司 <a href="">法律声明</a> <a href="">English</a> <a href="">泸ICP备 &bnot; 10013326号</a></p>
            <p>保时捷中国最强烈建议您：只在授权的保时捷中心购买车辆和配件</p>
            <p>请 <a href="index.html">还回主页</a>获得更多</p>
        </div>
    </div>
</div>


<div class="font">
    <div class="amerf" id="amerf">
        <i class="fa fa-upload"></i>
    </div>
</div>
<script src="js/vue.js"></script>
<script src="js/axima.js"></script>
<script src="swiper.min.js"></script>
<script src="js/json.js"></script>
<script src="js/fdj.js"></script>
<script>
    var tt = document.querySelector("#amerf");
    window.onscroll = function () {
        if (document.documentElement.scrollTop > 50 || document.body.scrollTop > 50){
            tt.style.display = "block";
        }else {
            tt.style.display = "none";
        }
    };
    //    点击返回顶部
    tt.onclick=function () {
        if (document.body.scrollTop!=0){
            window.scrollTo(0,0);
        }
        window.scrollTo({
            top:0,
            behavior:'smooth'
        })
    };
//    轮播图
    var swiper = new Swiper('.swiper-container', {
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });
//    轮播图结束
</script>
</body>
</html>
